<template>
    <div>
        <!-- <Header /> -->
        <!-- 轮播 -->
        <Lunbo />
        <!-- 九宫格 -->
        <div class="mui-content">
		        <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/newsInformation">
		                    <span class="mui-icon mui-icon-home"></span>
		                    <div class="mui-media-body">新闻资讯</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                  <router-link :to="{name:'photoShare'}">
		                    <span class="mui-icon mui-icon-email">
                          <span class="mui-badge">5</span>
                        </span>
		                    <div class="mui-media-body">图文分享</div>
                  </router-link>
                </li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                    <span class="mui-icon mui-icon-chatbubble"></span>
		                    <div class="mui-media-body">商品展示</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                    <span class="mui-icon mui-icon-location"></span>
		                    <div class="mui-media-body">留言反馈</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                    <span class="mui-icon mui-icon-search"></span>
		                    <div class="mui-media-body">搜索资讯</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                    <span class="mui-icon mui-icon-phone"></span>
		                    <div class="mui-media-body">联系我们</div></a></li>
		           
		        </ul> 
		</div>
        <!-- <Footer /> -->
    </div>
</template>
<script>
// import Header from '../commons/header.vue'
// import Footer from '../commons/footer.vue'
import Lunbo from "../commons/lunbo.vue";
export default {
  data() {
    return {};
  },
  components: {
    // Header,
    // Footer,
    Lunbo
  }
};
</script>
<style scoped>
.mui-icon-home:before {
  display: block;
  content: "";
  background: url(../../images/8.jpg) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
.mui-icon-email:before {
  display: block;
  content: "";
  background: url(../../images/18.png) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
.mui-icon-chatbubble::before {
  display: block;
  content: "";
  background: url(../../images/55st.png) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
.mui-icon-location::before {
  display: block;
  content: "";
  background: url(../../images/56st.png) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
.mui-icon-search::before {
  display: block;
  content: "";
  background: url(../../images/106st.png) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
.mui-icon-phone::before {
  display: block;
  content: "";
  background: url(../../images/banner_0.png) no-repeat;
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
</style>


